<template>
  <div>
    <h1>电影</h1>
    <button @click="getMovieList">获取电影</button>
    <ul>
      <li v-for="item in movieList" :key="item.tvId">{{ item.albumName }}</li>
    </ul>
    <hr />
    <h1>过滤了4-7的电影列表</h1>
    <ul>
      <li v-for="item in myMovieList" :key="item.tvId">{{ item.albumName }}</li>
    </ul>
    <hr />
    <h1>过滤了 五个字自定义的电影列表</h1>
    <ul>
      <li v-for="item in yourMovieList" :key="item.tvId">
        {{ item.albumName }}
      </li>
    </ul>
  </div>
</template>

<script>
import { mapState, mapActions,mapGetters } from "vuex";
export default {
  name: "Movie",
  methods: {
    ...mapActions("count",["getMovieList"]),
  },
  computed: {
    // ...mapState({price1:"price"})
    // ...mapState({ count1: "count", price: "price",movieList:"movieList" }),
    ...mapState("count",[ "movieList"]),
    ...mapGetters("count",["myMovieList"]),
    // myMovieList() {
    //   return this.$store.getters.myMovieList;
    // },
    yourMovieList() {
      return this.$store.getters["count/yourMovieList"]({ start: 2, end: 4 });
    },
  },
};
</script>

<style>
</style>